import  React,{Component} from 'react';
import {connect} from 'react-redux';
import {HtmlPageWrapper} from "./style";
import {Divider } from 'antd';
import {getHtmlContent} from "./store/actionCreators";
class ListPage extends Component{

    render(){
       const data={
           __html:this.props.Data?this.props.Data.get('content'):'敬请期待！',
           title:this.props.Data?this.props.Data.get('title'):'你要找的内容还未发布',
           author:this.props.Data?this.props.Data.get('author'):'',
           Time:this.props.Data?this.props.Data.get('creationTime'):'',
           Count:this.props.Data?this.props.Data.get('viewCount'):'1003',

       };

        return(
          <HtmlPageWrapper>
              <h1 style={{color:'#254e7e',fontWeight: 'bold',fontSize:'30px'}}>{data.title}</h1>
              <p style={{color:'#565b62'}}>发布者：{data.author} &nbsp; &nbsp; &nbsp;&nbsp;发布时间：{data.Time} &nbsp;&nbsp;&nbsp;&nbsp;浏览次数：{data.Count}</p>
              <Divider style={{marginBottom:'5px',background:'#565b62',height:'0.6px'}}/>

              <div style={{minHeight:'35.5vh'}} className='htmlCss' dangerouslySetInnerHTML={data} />
              <Divider style={{background:'#565b62',height:'0.6px'}}/>
          </HtmlPageWrapper>
        )

    }
    componentDidMount(){//初始化   拿到url请求改变列表中的数据

            if (!!this.props.location.search){
                this.props.changeGetContent(this.props.location.search);
                //?thname=表名&&id=
            }else{
                this.props.history.push('/');
            }

    }
    componentWillReceiveProps(nextProps){

    }
}
const mapState=(state)=>({
   Data: state.getIn(['HtmlPage','Data'])
});
const mapDispatch=(dispatch)=>({
    changeGetContent(url){
        dispatch(getHtmlContent(url));
    }
});
export default connect(mapState,mapDispatch)(ListPage);